@import "_reset.less";
@font-face {font-family: "bottomfont";
  src: url('bottomfont.eot'); /* IE9*/
  src: url('bottomfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('bottomfont.woff') format('woff'), /* chrome, firefox */
  url('bottomfont.ttf') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
  url('bottomfont.svg#bottomfont') format('svg'); /* iOS 4.1- */
}

.bottomfont {
  font-family:"bottomfont" !important;
  font-size:0.32rem;
  font-style:normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}
#share_content,#forhorview{
    display: none;
}
.center{
    .box-align(center);
    .box-pack(center);
}
.orient_ver{
     .box-orient(vertical);
}
.orient_hoz{
    .box-orient(horizontal);
}
#main{
    width:100%; 
    min-height: 100%;
    position: relative; 

}

/*******************菜单样式************************/

nav{
    z-index: 888;
    position: absolute;
    top:0;
    padding-top:1rem;
    bottom: 0;
    left:0;
    right:0;
    width:100%;
    display: none;
    ul{
        .transition(all 300ms ease-in-out);
        height:0;
        overflow: hidden;
        float: right;
        width:2.2rem;
        li{
            height:0.76rem;
            a{
                display: block;
                height: 100%;
                width:100%;
                text-align: center;
                line-height: 0.76rem;
            }
        }
    }
//  &.show{
//      ul{
//          height:15.2rem;
//      }
//  }
}
/*******************内页导航条样式************************/ 
.header{
    height: 1rem;
    .box();
    .box-orient(horizontal);  
    .box-align(center);
    a{
        width:1rem;
        .box();
        height:100%;
        .box-align(center);
        .box-pack(center);
        i.i_arrow{
            em,b{
                height: 0.06rem;
                width:0.24rem;
                
            }
            em{
                margin-top:-0.08rem;
            }
            b{
                margin-top:0.06rem
            }
        }
    }
    h2{
        .box-flex(1);
       
        font-weight: normal;
        border-left:1px solid #fff;
        text-indent: 0.24rem;
    }
}
/*******************首页导航条及内页下载条样式************************/
.topbar{
    
    height: 1rem;
    .box();
    .box-orient(horizontal);  
    .box-align(center);
   
    .logo{
        width:1rem;
        position: relative;
        z-index: 1;
        height:1rem;
        margin-left:0.32rem;
        margin-top:0.2rem;
        margin-right: 0.16rem;
    }
    .game_name{
        .box-flex(1);
        h2{
            font-size: 0.32rem;
        }
        p{
            
        }
    }
    a{
        width:1.2rem;
        height:0.52rem;
        margin-right:0.34rem;
        line-height: 0.56rem;
        font-size: 0.26rem;
        text-align: center;
        border-radius: 0.06rem;
        border-bottom:1px solid #fff;
        display: none;
        .box-orient(horizontal);  
        .box-align(center);
        .box-pack(center);
        &.show{
             .box();
        }
    }
    &.download_bar{
        .logo{
            height:0.8rem;
            width:0.8rem;
            margin-top:0;
            border-radius: 0.2rem;
            box-sizing: border-box;
        }
        a{
            box-shadow: none;
            height: 0.6rem;
            line-height: 0.6rem;
            
            i{display: none;}
        }
    }
}




/*******************列表模块标题栏样式************************/
.little_head{
    height: 0.88rem;
    border-width:1px;
  
    border-style: solid;
    line-height: 0.88rem;
    box-sizing: border-box;
    .box();
        .box-orient(horizontal);  
        .box-align(center);
    .i_title{
        width:0.14rem;
        height: 100%;
        display: block;
        margin-right: 0.14rem;
    }
    span{
        font-size:0.34rem;
        display: block;
         .box-flex(1);
    }
}

/*******************文本列表样式************************/
.list_view{
    li{ 
        a{
            .box();
            .box-orient(horizontal);  
            height: 0.8rem;
            line-height: 0.8rem;
            padding:0 0.28rem;
            span{
                display: block;
                .box-flex(1);
                width: 100%;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            em{
                display: block;
                font-weight: normal;
                font-style: normal;
                
            }
        }
    }
}
/*******************图文列表************************/
.list_view_img{
    li{
        
        a{
            .box();
            .box-orient(horizontal);  
            .box-align(center);
            height: 1.6rem;
            
            padding:0 0.32rem;
            img{
                width:1.28rem;
                height:1.28rem;
                margin-right: 0.2rem;
            }
            span{
                display: block;
                height: 1.28rem;
                .box-flex(1);
                h3{
                    width: 100%;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    font-size: 0.36rem;
                    margin-bottom: 0.05rem;
                    font-weight: normal;
                    
                }
                p{
                    color: #888;
                    
                   word-break: break-all;
                   line-height: 0.34rem;
                   height: 0.68rem;
                   overflow: hidden;
                }
            }
            
        }
    }
}
/*******************公用底部样式************************/

.div_buttons{
    padding-top: 0.44rem ;
    margin-bottom: 0.7rem;
    .box();
    .box-orient(horizontal);  
    .box-pack(center);
       
        a{
            display: block;
            
        }
    }
.site_bottom{
  
    box-sizing: border-box;
    
    .button{
        
        height: 0.7rem;
        width:3.35rem;
        margin: 0 0.2rem;
        font-size: 0.3rem;
        line-height: 0.7rem;
        //margin: 0 auto;
        display: block;
        border-radius: 0.1rem;
        text-align: center;
        font-weight: bold;
        &.show{
             display: block;
        }
        
    }
    
    ul{
        .box();
        .box-orient(horizontal);
        .box-pack( justify);
        padding: 0 0.24rem;
        
        margin-bottom:0.56rem;
        li{
            //.box-flex(1);
            
            
            a{
                .box();
                .box-orient(horizontal);
                height: 0.6rem;
                line-height: 0.6rem;
                i{
                    display: block;
                    font-size: 0.4rem;
                    width:0.6rem;
                    height:0.6rem;
                    margin-right: 0.1rem;
                    line-height: 0.6rem;
                    box-sizing: border-box;
                    border:1px solid #eaf1fa;
                    color: #eaf1fa;
                    text-align: center;
                }
                span{
                    font-size:0.28rem;
                    display: block;
                    color: #eaf1fa;
                } 
            }
        }
    }
    .site_tel{
        color: #fff;
        margin-bottom:0.32rem;
       
        h3{
            .box();
            .box-pack(center);
            .box-align(center);
            .box-orient(horizontal);
            
            i{
                
                margin-right: 0.1rem;
                display: block;
                }
            span{
                font-size: 0.28rem;
                font-weight: normal;
                line-height: 0.4rem;
                display: block;
            }
        }
        p{
            text-align: center;
        }
    }
    
    .icon_tel{
        width:0.42rem;
        height:0.4rem;
        background-image:url(../img/icons.png) ;
        background-repeat: no-repeat;
        background-size: auto 0.6rem;
        margin-right: 0.08rem;
        background-position: -2.5rem -0.08rem;
        display: inline-block;
        line-height: 0.56rem;
    }
    .NIE-copyRight_m{
        padding:  0.4rem 0.32rem ;
        min-height: 0.8rem;
        p{
            text-align: center;
            font-size:0.26rem;
            line-height: 0.4rem;
        }
    }
}
/*******************回到顶部按钮样式************************/
.btn_toTop{
    width:0.96rem;
    height: 0.96rem;
    display: block;
    position: absolute;
    bottom: 0.26rem;
    right: 0.26rem;
    margin-left:-0.25rem;
    
    .box();
    .box-pack(center);
    .box-align(center);
    overflow: hidden;
    i{
        width:0.3rem;
        height: 0.3rem;
        border-left:0.08rem solid #100000;
       border-top:0.08rem solid #100000;
       border-bottom: 0;
       border-right:0;
       .transform(rotate(45deg));
       display: block;
       margin-top: 0.2rem;
       
    }
}

.i_icon{
    width:0.3rem;
    height:0.3rem;
    display: block;
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: 100% ;
   
}
.i_arrow{
    width:0.8rem;
    height:0.8rem;
    display: block;
    position: relative;
    .box();
    .box-align(center);
    .box-pack(center);
    i{
       width:0.3rem;
       height: 0.3rem;
       border-right:0.06rem solid #100000;
       border-top:0.06rem solid #100000;
       border-bottom: 0;
       border-left:0;
       .transform(rotate(45deg));
       display: block;
      
    }
    &.i_arrow_left{
        .rotate(-180deg);
    }
    &.i_arrow_top{
        .rotate(-90deg);
    }
}
//.site_bottom{
//  height: auto;
//  box-sizing: border-box;
//  padding: .4rem 0.56rem;
//  .button{
//      height: 0.7rem;
//      width:48%;
//      font-size: 0.3rem;
//      line-height: 0.7rem;
//      //margin: 0 auto;
//      display: block;
//      border-radius: 0.1rem;
//      text-align: center;
//      font-weight: bold;
//  }
//  .div_buttons{
//       .box();
//      .box-orient(horizontal);  
//
//       .box-pack(justify);
//          
//          a{
//              display: block;
//              
//          }
//  }
//  ul{
//      li{
//          border-width:0;
//          border-bottom-width: 1px;
//              border-style: solid ;
//          a{
//              font-size:0.32rem;
//              display: block;
//              height: 1.28rem;
//              line-height: 1.28rem;
//              
//          }
//      }
//      margin-bottom:0.6rem;
//  }
//  > a,> p{
//      display: block;
//      height:0.56rem;
//      line-height: 0.56rem;
//      font-size:0.28rem;
//  }
//  .NIE-copyRight_m{
//      p{
//          font-size:0.24rem;
//          line-height: 0.36rem;
//      }
//  }
//}

/*******************菜单按钮样式************************/
.i_menu{
    .box();
    .box-orient(vertical);  
    .box-align(center);
    .box-pack(center);
    
    height:100%;
    width:100%;
    em{
        display: block;
        height:0.04rem;
        width:0.4rem;
        margin:0.04rem 0;
        position: relative;
        .transition(all 0.3s  ease);
        opacity: 1.0;
        &:nth-child(2n+2){
            background: transparent;
        }
        b{
            .transition(all 0.3s ease );
            position: absolute;
            height:0.04rem;
            width:0.4rem;
            left:0;
            top:0;
        }
    }
    
}
.btn_menu{
    
    &.active{
        .i_menu{
            em{
                &:nth-child(2n+1){
                   .translate(0 ,0.2rem);
                   opacity: 0;
                }
                &:nth-child(2n+2){
                    b:nth-child(2n+1){
                        .rotate(45deg)
                    }
                    b:nth-child(2n+2){
                        .rotate(-45deg);
                    }
                }
                &:nth-child(2n+3){
                    
                   .translate(0 ,-0.2rem);
                    opacity: 0;
                }
            }
        }
    }
}
.btn_getmore{
    width:100%;
    height:0.8rem;
    line-height: 0.8rem;
    text-align: center;
    display: none;
}
/*******************遮罩层通用样式************************/
.mask{
    transition:opacity 0.3s ease-in-out 0s;
    -moz-transition:opacity 0.3s ease-in-out 0s;
    -webkit-transition:opacity 0.3s ease-in-out 0s;
    -o-transition:opacity 0.3s ease-in-out 0s;
    position: fixed;
    left:0;
    right:0;
    top:0;
    bottom:0;
    width:100%;
    background:rgba(0,0,0,0.6);
    display: none;
    opacity: 0.0;
    z-index: 999;
    &.show{
        opacity: 1.0;
       
    }
}

/*******************对话框样式************************/
.alertbox{
    z-index:1000;
    position: fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    background:rgba( 0,0,0,0);
    .box();
  
    .box-align(center);
    .box-pack(center);
    .transition( all 300ms ease-in);
    .alert_text{
        .transform(translate(0,-30rem));
        .transition( all 300ms ease-in);
        position: relative;
        width:6.6rem;
        min-height: 2.5rem;
        box-sizing: border-box;
        margin:0 auto;
        padding:0.5rem 0.24rem;
        background-color: #ff7491;
        border: none;
        font-size: .26rem;
        color: #fff;
        
        
        h2{
            font-size:0.4rem;
            line-height: 0.8rem;
            text-align: center;
            
        }
        p{
            text-align: center;
           
            
            line-height: 0.6rem;
        }
    }
    &.show{
        background:rgba( 0,0,0,0.6);
        .alert_text{
            .transform(translate(0,0))
        }
    }
    &.remove{
        background: rgba(0,0,0,0);
        .alert_text{
            .transform(translate(0,50rem))
        }
    }
    .btn_close{
        position: absolute;
        right:0.1rem;
        top:0.1rem;
    }
}
.btn_close{
        width:0.6rem;
        height:0.6rem;
        .box(); 
        .box-align(center);
        .box-pack(center);
        em,i{
            display: block;
            background:#fff;
            width:0.6rem;
            height:0.04rem;
            
        }
        em{
            .rotate(45deg);
        }
        i{
            .rotate(-45deg);
            margin-left:-0.6rem;
        }
    }
/*******************横屏提示弹层样式************************/
#forhorview{
    position: fixed;
    z-index: 20000;
    top:0;
    bottom:0;
    left:0; 
    right:0;
    width:100%;
    background: rgba(0,0,0,0.6);
    background: #000;
    // display: none!important;
    visibility: hidden;
    display: none;
    
    // display: box!important;
    // visibility: visible;
    
    .box-orient(vertical);
    .box-align(center);
    .box-pack(center);
    p{
        font-size:0.6rem;
        color:#ddd;
    }
    &.show{
        .box();
        
    }
}

#forhorview2{
    position: fixed;
    z-index: 20005;
    top:0;
    bottom:0;
    left:0; 
    right:0;
    width:100%;
    background: rgba(0,0,0,0.6);
    background: #000;
    display: none;
    .box-orient(vertical);
    .box-align(center);
    .box-pack(center);
    p{
        font-size:0.6rem;
        color:#ddd;
        text-align: center;
    }
    &.show{
        .box();
        
    }
}
/*******************通用抽屉层样式************************/
.moudle{
    position: relative;
    z-index: 99;
    height:100%;
     transition:opacity 0.3s ease-in-out 0s;
    -moz-transition:opacity 0.3s ease-in-out 0s;
    -webkit-transition:opacity 0.3s ease-in-out 0s;
    -o-transition:opacity 0.3s ease-in-out 0s;
    display: none;
    opacity: 0.0;
    &.show{
        opacity: 1.0;
    }
}
/*******************关注公众号弹层样式************************/
#md_attention{
    .attention{
        position: fixed;
        bottom: 12%;
        left:0;
        right: 0;
        width:100%;
        background: transparent;
        box-sizing: border-box;
        padding: 0 0.5rem ;
        height:1rem;
        .box();
        .box-orient(horizontal);  
        .box-align(center);
   
        i{
            display: block;
            width: 1rem;
            height:1rem;
            box-sizing: border-box;
            border-radius: 1rem;
            font-size: 0.8rem;
            text-align: center;
            line-height: 1rem;
//          background-image: url(../img/sns_icon.png);
//          background-repeat: no-repeat;
//          background-position-y: -0.72rem;
//          background-size: auto 1.44rem;
//          background-position-x: 0;
            margin-right:.1rem;
//          &.i_yx{
//              background-position-x: -0.93rem;
//          }
           
        }
        em{
            .box-flex(1);
            display: block;
            font-size: 0.28rem;
            color: #fff;
            font-style: normal;
        }
        
    }
}
/*******************弹窗样式************************/
.popWin{
    position: fixed;
    left:0;
    right:0;
    bottom: 0;
    top: 0;
    width:100%;
    display: none;
    
    .box-orient(horizontal);
    .box-align(center);
    .box-pack(center);
    section{
        width:5.8rem;
        
        .popWin_header{
            .box();
            .box-orient(horizontal);
            .box-align(center);
            height:0.8rem;
            line-height:0.8rem;
            span{
                font-size: 0.32rem;
                text-indent: 0.2rem;
                display: block;
                .box-flex(1);
            }
            a{
                margin-right: 0.06rem;
            }
            
        }
        .popWin_content{
            box-sizing: border-box;
            padding: 0.3rem 0.2rem;
            min-height: 4rem;
            display: none;
            
            h2{
                font-size:0.36rem;
                line-height: 0.6rem;
                margin:0.2rem 0;
                text-align: center;
            }
            h3{
                font-size: 0.28rem;
                font-weight: normal;
                line-height: 0.4rem;
            }
            p{
                 font-size: 0.24rem;
                line-height: 0.4rem;
            }
            &.current{
                .box();
                
                
            }
        }
    }
    &.popup{
        .box();
    }
}
/*******************礼包模块样式************************/

#gain_init{
   
}
#gain_result{
   
   
    a{
        margin:0.4rem 0
    }
}
#active{
    .box-orient(vertical);
    .form{
        margin-bottom: 0.3rem;
    }
}
.active_ios{
    .for_and{
        display: none;
        
    }    
}
.active_and{
    .for_ios{
        display: none;
    }
}
.for_success{
    display: none;
    
}
.active_success{
    .for_ios{
        display: none;
        
    }
    .for_and{
        display: none;
    }  
    .for_success{
        display: block;
    }
}
/*******************输入框+按钮表单样式************************/
.form_bar{
    .box();
    .box-orient(horizontal);
    width:100%;
    height:0.8rem;
    span{
        border:1px solid #ddd;
        box-sizing:border-box;
        
        border-right:0;
        .box-flex(1);
        height:0.8rem;
        line-height: 0.28rem;
        
        display: block;
        input{
            padding: 0.22rem 0.16rem;
            
            box-sizing: border-box;
            width:100%;
            height: 100%;
            border:0
        }
    };
    
    a{
        display: block;
        width:1.88rem;
        height:0.8rem;
        line-height: 0.8rem;
        text-align: center;
        font-size: 0.3rem;
    }
}
/******************表单样式***********************/
.form{
    dl{
        .box();
        .box-orient(horizontal);
        height:0.7rem;
        border:1px solid #ddd;
        box-sizing: border-box;
        width:100%;
        margin-bottom:0.3rem;
        dt{
            width:1.6rem;
            box-sizing: border-box;
            border-right:1px solid #ddd;
            display: block;
            height: 100%;
           
            font-size: 0.24rem;
            line-height: 0.66rem;
            text-align: center;
        }
        dd{
            display: block;
            height: 100%;
            .box-flex(1);
            padding:0.2rem;
            box-sizing: border-box;
            input{
                width:100%;
                border:0;
               display: block;
            }
        }
    }
}
/*******************通用按钮样式************************/
.btn_common{
    display: block;
    height: 0.8rem;
    line-height: 0.8rem;
    text-align: center;
    font-size: 0.3rem;
    
}
/*******************短按钮样式************************/
.btn_short{
    width:2.9rem;
}
